//
//  LoginView.swift
//  DadaSolusi
//
//  Created by liyahao on 2025/9/9.
//

import SwiftUI
import AppTrackingTransparency
import AdSupport
import CoreLocation

// MARK: - LoginView
struct LoginView: View {
    @StateObject private var viewModel = LoginVModel()
    @State private var isAgreed = true
    @FocusState private var focusedField: Field?
    
    enum Field {
        case phone
        case code
    }
    
    var body: some View {
        // Content
        ScrollView {
            // Header
            headerView
            VStack(spacing: 20) {
                Spacer().frame(height: 40)
                
                // Phone Number Input
                phoneNumberSection
                
                // Verification Code Input
                verificationCodeSection
                
                Spacer().frame(height: 40)
                
                // Login Button
                loginButton
                
                Spacer().frame(height: 30)
                
                // Agreement
                agreementSection
            }
            .padding(.horizontal, 24)
        }
        .background(Color(UIColor.systemGray6))
        .ignoresSafeArea(edges: .top)
        .onAppear {
            viewModel.requestIDFA()
            viewModel.loadSavedPhoneNumber()
        }
    }
    
    // MARK: - Header View
    private var headerView: some View {
        ZStack(alignment: .bottom) {
            // Green background
            Color(hex: 0x09C860)
                .frame(height: 289)
            
            VStack(spacing: 20) {
                HStack {
                    VStack(alignment: .leading, spacing: 8) {
                        Text("Quick login using")
                            .font(.system(size: 20, weight: .heavy))
                            .foregroundColor(.white)
                        Text("Mobile phone number")
                            .font(.system(size: 16))
                            .foregroundColor(.white.opacity(0.9))
                    }
                    Spacer()
                    Image(.imageLoginPhone)
                }
                .padding([.horizontal,.bottom], 24)
            }
        }
    }
    
    // MARK: - Phone Number Section
    private var phoneNumberSection: some View {
        VStack(alignment: .leading, spacing: 12) {
            Text("Phone Number")
                .font(.system(size: 16))
                .foregroundColor(.gray)
            
            HStack {
                HStack(spacing: 8) {
                    Image(systemName: "globe")
                        .foregroundColor(Color(hex: 0x999999))
                    Text("+91")
                        .foregroundColor(Color(hex: 0x999999))
                    Rectangle()
                        .fill(Color.gray.opacity(0.3))
                        .frame(width: 1, height: 20)
                }
                .padding(.leading, 16)
                
                TextField("Enter your number", text: $viewModel.phoneNumber)
                    .keyboardType(.numberPad)
                    .focused($focusedField, equals: .phone)
                    .padding(.trailing, 16)
            }
            .frame(height: 54)
            .background(Color.white)
            .overlay(
                RoundedRectangle(cornerRadius: 12)
                    .stroke(Color.black, lineWidth: 3)
            )
            .cornerRadius(12)
        }
    }
    
    // MARK: - Verification Code Section
    private var verificationCodeSection: some View {
        VStack(alignment: .leading, spacing: 12) {
            Text("Verification Code")
                .font(.system(size: 16))
                .foregroundColor(.gray)
            
            HStack {
                TextField("Please enter the code", text: $viewModel.verificationCode)
                    .keyboardType(.numberPad)
                    .focused($focusedField, equals: .code)
                    .padding(.leading, 16)
                
                Button(action: {
                    viewModel.sendVerificationCode()
                }) {
                    Text(viewModel.countdownText)
                        .font(.system(size: 14, weight: .medium))
                        .foregroundColor(viewModel.canSendCode ? Color(red: 46/255, green: 204/255, blue: 113/255) : .gray)
                }
                .disabled(!viewModel.canSendCode)
                .padding(.trailing, 16)
            }
            .frame(height: 54)
            .background(Color.white)
            .overlay(
                RoundedRectangle(cornerRadius: 12)
                    .stroke(Color.black, lineWidth: 3)
            )
            .cornerRadius(12)
        }
    }
    
    // MARK: - Login Button
    private var loginButton: some View {
        Button(action: {
            if isAgreed {
                viewModel.login()
            }
        }) {
            Text("Quick Login")
                .font(.system(size: 16, weight: .semibold))
                .foregroundColor(.black)
                .frame(maxWidth: .infinity)
                .frame(height: 50)
                .background(Color(hex: 0xFDB92E))
                .cornerRadius(28)
        }
    }
    
    // MARK: - Agreement Section
    private var agreementSection: some View {
        HStack(spacing: 12) {
            Button(action: {
                isAgreed.toggle()
            }) {
                Image(isAgreed ? "image_login_select" : "image_login_unselect")
                    .resizable()
                    .frame(width: 36, height: 36)
                    .scaledToFit()
            }
            
            HStack(spacing: 4) {
                Text("I have read and agree")
                    .font(.system(size: 12))
                    .foregroundColor(Color(hex: 0x000000))
                Button(action: {
                    // Open privacy agreement
                }) {
                    Text("privacy agreement")
                        .font(.system(size: 12, weight: .semibold))
                        .foregroundColor(Color(hex: 0x000000))
                }
            }
            
            Spacer()
        }
        .overlay(RoundedRectangle(cornerRadius: 28).stroke(Color.black, lineWidth: 2))
        .background(Color(hex: 0x09C860))
        .cornerRadius(24)
    }
    
    // MARK: - Toast View
    private var toastView: some View {
        Text(viewModel.toastMessage)
            .font(.system(size: 14))
            .foregroundColor(.white)
            .padding(.horizontal, 20)
            .padding(.vertical, 12)
            .background(Color.black.opacity(0.8))
            .cornerRadius(20)
    }
}

#Preview {
    LoginView()
}
